<template>
    <div class="HomeErC">
        <div class="HomeErB">
            <div class="HomeErA">
                <div class="HomeErA-1">
                    <router-link to="/details">
                        <div class="list-img">
                            <img src="/image/Home/home-list-img.png" alt="">
                        </div>
                        <div class="list-con">
                            <p>皮皮虾神仙桶(避风塘椒盐双拼)</p>
                            <span class="list-con-sum">594人已买过</span>
                            <div class="list-con-bot">
                                <div class="list-con-left">
                                    <van-icon name="new-arrival-o" class="home-new-icon"/>
                                    <span>￥<span class="list-con-left-money">158</span><span class="list-con-left-fen">/份</span></span>
                                </div>
                                <div class="list-con-right">
                                    <van-icon name="cart-circle" color="#4facf8" class="home-shop-icon"/>
                                </div>
                            </div>
                        </div>
                    </router-link>
                </div>
                <div class="HomeErA-1">
                    <router-link to="/details">
                        <div class="list-img">
                            <img src="/image/Home/home-list-img.png" alt="">
                        </div>
                        <div class="list-con">
                            <p>皮皮虾神仙桶(避风塘椒盐双拼)</p>
                            <span class="list-con-sum">594人已买过</span>
                            <div class="list-con-bot">
                                <div class="list-con-left">
                                    <van-icon name="new-arrival-o" class="home-new-icon"/>
                                    <span>￥<span class="list-con-left-money">158</span><span class="list-con-left-fen">/份</span></span>
                                </div>
                                <div class="list-con-right">
                                    <van-icon name="cart-circle" color="#4facf8" class="home-shop-icon"/>
                                </div>
                            </div>
                        </div>
                    </router-link>
                </div>
                <div class="HomeErA-1">
                    <router-link to="/details">
                        <div class="list-img">
                            <img src="/image/Home/home-list-img.png" alt="">
                        </div>
                        <div class="list-con">
                            <p>皮皮虾神仙桶(避风塘椒盐双拼)</p>
                            <span class="list-con-sum">594人已买过</span>
                            <div class="list-con-bot">
                                <div class="list-con-left">
                                    <van-icon name="new-arrival-o" class="home-new-icon"/>
                                    <span>￥<span class="list-con-left-money">158</span><span class="list-con-left-fen">/份</span></span>
                                </div>
                                <div class="list-con-right">
                                    <van-icon name="cart-circle" color="#4facf8" class="home-shop-icon"/>
                                </div>
                            </div>
                        </div>
                    </router-link>
                </div>
                <div class="HomeErA-1">
                    <router-link to="/details">
                        <div class="list-img">
                            <img src="/image/Home/home-list-img.png" alt="">
                        </div>
                        <div class="list-con">
                            <p>皮皮虾神仙桶(避风塘椒盐双拼)</p>
                            <span class="list-con-sum">594人已买过</span>
                            <div class="list-con-bot">
                                <div class="list-con-left">
                                    <van-icon name="new-arrival-o" class="home-new-icon"/>
                                    <span>￥<span class="list-con-left-money">158</span><span class="list-con-left-fen">/份</span></span>
                                </div>
                                <div class="list-con-right">
                                    <van-icon name="cart-circle" color="#4facf8" class="home-shop-icon"/>
                                </div>
                            </div>
                        </div>
                    </router-link>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: "HomeErC"
}
</script>

<style scoped>
.HomeErA{
    margin: 0 .13rem .45rem .13rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.list-con-left{
    display: flex;
    align-items: center;
}
.list-con-left span span{
    font-size: .14rem;
}
.HomeErA-1{
    display: table;
    width: 1.88rem;
    border-radius: .10rem;
    background-color: #fff;
    margin-bottom: .10rem;
}
.home-new-icon{
    font-size: .24rem;
    color: #eb5d3f;
}
.list-con-left span{
    color: #eb5d3f;
}
.list-con-left .list-con-left-money{
    font-size: .16rem;
}
.list-con-left .list-con-left-fen{
    color: #999;
}
.home-shop-icon{
    font-size: .24rem;
}
.list-con{
    padding-left: .10rem;
    padding-right: .16rem;
}
.list-con p{
    padding-top: .08rem;
    padding-bottom: .06rem;
    font-size: .15rem;
    width: 1.60rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #333;
}
.list-con .list-con-sum{
    color: #eb5d3f;
}
.list-con-bot{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: .06rem 0;
}
.list-img{
    width: 1.88rem;
    height: 1.88rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.list-img img{
    width: 1.88rem;
    height: 1.23rem;
    object-fit: cover;
    vertical-align: middle;
}
</style>